<!doctype html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>简介</title>
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
        <link href="../../../css/mui.min.css" rel="stylesheet" />
        <style>
            .mui-content {
                position: relative;
            }
            #wordNum {
                position: absolute;
                right: 10px;
                bottom: 25px;
                font-size: 14px;
                color: #ccc;
            }
        </style>
    </head>
    <body>
        <header class="mui-navbar-inner mui-bar mui-bar-nav">
            <button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
                <span class="mui-icon mui-icon-left-nav"></span>
            </button>
            <h1 class="mui-center mui-title">简介</h1>
            <button type="button" class="mui-btn mui-btn-success mui-pull-right" id="save">保存</button>
        </header>
        <div class="mui-content">
            <textarea id="attending" name="Attending" rows="12" placeholder="请描述您的简介。（限200个中文字）" maxlength="200"></textarea>
            <div id="wordNum"><span>0</span>/200</div>
        </div>
        <script src="../../../js/mui.min.js"></script>
        <script src="../../../js/http.js"></script>
        <script src="../../../js/userInfo.js"></script>
        <script type="text/javascript">
            var $ = mui,
                doc = document,
                attending = document.getElementById('attending'),
                wordNum = $("#wordNum span")[0];

            $.init({
                beforeback: function() {
                    //获得列表界面的webview
                    var info = plus.webview.getWebviewById('info');
                    //触发列表界面的自定义事件（refresh）,从而进行数据刷新
                    mui.fire(info, 'refreshInfo');
                    //返回true，继续页面关闭逻辑
                    return true;
                }
            });

            // 初始化简介
            $.plusReady(function() {
                attending.value = userInfo.regdoctor.attending;
                wordNum.innerText = attending.value.length;
            });

            // 计算录入字数
            attending.addEventListener('input', function() {
                var len = this.value.length;
                wordNum.innerText = len;
            });

            // 保存事件
            doc.getElementById('save').addEventListener('tap', function() {
                if (!wordNum.innerText.length) {
                    $.toast("请录入简介");
                } else {
                    save();
                }
            });
            // 调用保存接口
            function save() {
                plus.nativeUI.showWaiting('保存中...');
                var opt = {
                    UserID: userInfo.regdoctor.userID,
                    Attending: attending.value
                };
                myHttp('/inquiry/update', opt, 'post', function (res) {
                    plus.nativeUI.closeWaiting();
                    if (res.success) {
                        $.toast("保存成功");
                        // 更新用户信息缓存
                        userInfo.regdoctor.attending = attending.value;
                        plus.storage.setItem('userInfo', JSON.stringify(userInfo));
                        //登录成功
                        $.back();
                    } else {
                        $.toast("保存失败");
                    }
                });
            }
        </script>
    </body>
</html>